package com.example.jetpackcomposebasic

import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.padding
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.Favorite
import androidx.compose.material3.ExperimentalMaterial3Api
import androidx.compose.material3.Icon
import androidx.compose.material3.IconButton
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Scaffold
import androidx.compose.material3.Text
import androidx.compose.material3.TopAppBar
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp

@Preview
@Composable
fun PreviewScaffoldLayout() {

    ScaffoldLayout()
}

@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun ScaffoldLayout() {

    /*
    * Scaffold 槽位API
    * 确保组件（例如：TopAppBar BottomAppBar FloatingActionBar Drawer）
    * 得到正确的放置且正确协同的工作
    * */
    Scaffold(
        topBar = {
            TopAppBar(
                title = { Text(text = "顶部标题") },
                actions = {
                    IconButton(onClick = { /*TODO*/ }) {

                        Icon(imageVector = Icons.Default.Favorite, contentDescription = null)
                    }
                }
            )
        }
    ) { innerPadding ->

        BodyContent(Modifier.padding(innerPadding))
    }


}

@Composable
fun BodyContent(modifier: Modifier = Modifier) {
    Column(modifier = modifier.padding(8.dp)) {
        Text(text = "标题", style = MaterialTheme.typography.headlineMedium)
        Text(text = "内容", style = MaterialTheme.typography.bodySmall)
    }
}